<template>
	<view>
		<view class="status_bar"></view>
		<view class="h90 themeBac cwhite f-c-c">我的</view>

		<view class="content">
			<!-- 用户信息 -->
			<view class="user f-c-b" @click="$to('../personal-information/personal-information')">
				<view class="f-c">
					<image class="user-head" :src="userlist.img" mode=""></image>
					<view class="">
						<view class="f30 themeColor">{{userlist.name}}</view>
						<view class="f25 themeColor">账号：{{userlist.number}}</view>
					</view>
				</view>
				<image class="arrow-right" src="../../static/my/icon_gd.png" mode="widthFix"></image>
			</view>

			<view class="f30">
				<view @click="index===5?uniShare():$to(item.pageUrl)" v-for="(item,index) in list"
					class="f-c-b content-item">
					<view class="">
						<image class="iconImg" :src="item.url" mode="widthFix"></image>
						<text>{{item.title}}</text>
					</view>
					<image class="arrow-right" src="../../static/my/icon_gd.png" mode="widthFix"></image>
				</view>
			</view>
		</view>

		<view class="btn">
			<button @click="show=true" class="themeBac cwhite">退出登录</button>
		</view>

		<!-- 退出 的 模态框 -->
		<u-modal v-model="show" :content="content" :show-title="false" :show-cancel-button="true" width="60%" :content-style="contentStyle" confirm-color="#373737" @confirm="toReg"></u-modal>

		<Tabbar></Tabbar>
	</view>
</template>

<script>
	import Tabbar from '../../components/Tabbar.vue'
	import uniShare from 'uni_modules/uni-share/js_sdk/uni-share.js';
	export default {
		components: {
			Tabbar
		},
		data() {
			return {
				userlist: {},
				baseUrl: this.$u.baseUrl,
				list: [{
					title: "我的发布",
					url: '../../static/my/icon_wdfb.png',
					pageUrl: '../my-release/my-release'
				}, {
					title: "待确定",
					url: '../../static/my/icon_dqd.png',
					pageUrl: '../to-be-determined/to-be-determined'
				}, {
					title: "已完成",
					url: '../../static/my/icon_yzh.png',
					pageUrl: '../retrieved/retrieved'
				}, {
					title: "钱包",
					url: '../../static/my/icon_qb.png',
					pageUrl: '../wallet/wallet'
				}, {
					title: "账号安全",
					url: '../../static/my/icon_zhan.png',
					pageUrl: '../account-and-security/account-and-security'
				}, {
					title: "分享APP",
					url: '../../static/my/icon_zhan.png'
				}, {
					title: "关于",
					url: '../../static/my/icon_gy.png',
					pageUrl: '../about/about'
				}, ],
				show: false,
				content: "是否退出登录",
				contentStyle: {
					fontSize: "34rpx",
					color: "#373737"
				},
				flag: true
			}
		},
		mounted() {
			// $on 监听事件
			uni.$on('userInfo', data => {
				console.log(data)
				console.log(data);
				this.userlist = data
			})
		},
		onLoad() {
			this.flag=true
			console.log(this.vuex_user);
			uni.hideTabBar()
			if (this.flag) {
				this.userlist = this.vuex_user
				this.userlist.img = this.baseUrl + this.userlist.img
				this.flag = false
			}

		},
		methods: {
			uniShare() {
				uniShare({
					content: { //公共的分享参数配置  类型（type）、链接（herf）、标题（title）、summary（描述）、imageUrl（缩略图）
						type: 0,
						href: 'https://uniapp.dcloud.io/',
						title: '标题',
						summary: '描述',
						imageUrl: 'https://img-cdn-aliyun.dcloud.net.cn/stream/icon/__UNI__HelloUniApp.png'
					},
					menus: [{
							"img": "/static/app-plus/sharemenu/icon_wx.png",
							"text": "微信好友",
							"share": { //当前项的分享参数配置。可覆盖公共的配置如下：分享到微信小程序，配置了type=5
								"provider": "weixin",
								"scene": "WXSceneSession"
							}
						},
						{
							"img": "/static/app-plus/sharemenu/icon__pyq.png",
							"text": "朋友圈",
							"share": {
								"provider": "weixin",
								"scene": "WXSenceTimeline"
							}
						},
						{
							"img": "/static/app-plus/sharemenu/icon_fzlj.png",
							"text": "复制链接",
							"share": "copyurl"
						},
					],
					cancelText: "取消分享",
				}, e => { //callback
					console.log(e);
				})
			},
			toReg(){
				this.$u.vuex("vuex_user",{})
				// this.vuex_user={}
				console.log(this.vuex_user);
				this.$redirec('../register/register')
			}
		},

	}
</script>

<style>
	.content {
		margin: 30rpx 40rpx;
	}

	.user {
		margin: 40rpx 0;
	}

	.user-head {
		width: 80rpx;
		height: 80rpx;
		margin-right: 20rpx;
		border-radius: 50%;
	}

	.arrow-right {
		width: 15rpx;
	}

	.iconImg {
		width: 30rpx;
		margin-right: 20rpx;
	}

	.content-item {
		padding: 30rpx 0 15rpx 0;
		border-bottom: 1rpx solid #373737;
	}

	.btn {
		margin: 40rpx 60rpx;
	}
</style>
